Learn about other types of media queries, based on color preferences and accessibility features

Learn how to alter the colors of your website and enhance its accessibility by using the prefers-contrast media query

Learn how to create a dark theme for your website by using the prefers-color-scheme media query

Learn how to combine conditions in a media query to create a responsive range between two breakpoints

Learn how to adopt a mobile-first approach when design a responsive website

Learn the basics of Responsive Design with Media Queries: how you can apply different styles based on the characteristics of the media

Learn how to toggle Dark Mode in CSS with JavaScript, and use Local Storage to save the user preference between sessions

An introduction to Dark Mode in CSS, using CSS variables and the prefers-color-scheme media query

Learn how to apply multiple backgrounds to an element

Learn how to create and use a background sprite image

Learn how to specify the size of a background image

Learn how to position a background image within an element

Learn how to specify how a background image will repeat

Learn how to apply a background image to an element

Learn how to apply a background color to an element

Learn how to change the style of a text

Learn how to change the weight of a text

Learn how to change the height of each line of text

Learn how to change the size of a text

Learn how to specify the font family of a text

Learn the difference between a Typeface and a Font

Learn about the basics of Web Typography

Learn how to create radial gradients in CSS

Learn how to create linear gradients in CSS

Learn all about the HSL format in CSS

Learn all about the Hexadecimal format in CSS

Learn all about the RGB format in CSS

Learn what colors are about in CSS

Learn how to change the position of Flex Items

Learn how to distribute Flex Items along the cross axis

Learn how to distribute Flex Items along the main axis

Learn how to add space between Flex Items

Learn how to change in which direction Flex Items will flow

Learn how to change in which direction Flex Items will flow

Learn what Flex Grow and Flex Shrink calculations are based upon

Learn how to resize Flex Items where there isn't enough space for them

Learn how to make use of the remaining space of a Flexbox context

Learn about the two parts of a Flexbox layout

Learn what Flexbox is all about

Learn how to target elements based on what their are not

Learn how to target sibling elements and direct successor elements

Learn how to target specific child elements

Learn how to build complex selectors to target HTML elements based on their position in the document tree

Learn how to target HTML elements based on their attributes

Learn how to style elements in different states: hover, active, disabled, focused

Learn how to create more advanced selectors by combining different ones

Learn which selectors have priority over others

Learn how to select which HTML elements are targeted by your CSS